var nav_useSubChange = false;
/**锚点链接*/
var nav_anchor;
/**当前导航标签(主)*/
var nav_now_index;
/**窗体加载*/
$(() => {
    const doc = $(document); { /**nav控制*/
        const top_nav = $("#top_nav");
        const head_nav = $("#head_nav");
        const head_top = $("#head_top");
        if (top_nav.length && head_nav.length && head_top.length) {
            let isTop = false;
            const scroll_checker = () => {
                let y = head_nav.offset().top + head_nav.height();
                let h = head_top.height();
                let s = doc.scrollTop();
                if (s + h > y) { //显示top_nav
                    if (isTop) return;
                    top_nav.fadeIn();
                    isTop = true;
                } else { //显示head_nav
                    if (!isTop) return;
                    top_nav.fadeOut();
                    isTop = false;
                }
            };
            scroll_checker();
            $(window).scroll(scroll_checker);
            $(".main-content").hide();
            for (let hns = head_nav.children(), i = 0, l = hns.length; i < l; i++) {
                top_nav.append(`<span onclick="nav_click(false);">${hns[i].innerText}</span>`)
            }
            for (let hns = head_nav.children(), i = 0, l = hns.length; i < l; i++)
                if ($(hns[i]).hasClass("active")) {
                    change_nav(i);
                    break;
                }

        } else {
            change_nav(0);
        }
    }
    (window.onpopstate = () => {
        /**自动跳转到锚点页面*/
        let url = window.location.hash,
            start = url.indexOf('#'),
            end = start >= 0 ? url.indexOf('?', start) : -2,
            go = start >= 0 && url.substring(start, end > 0 ? end : url.length);
        nav_anchor = go || "";
        change_nav((go && (go = $(go))) ? go.hasClass('main-content') ? go.index() : go.parents('.main-content').index() : 0);
        if (nav_useSubChange &&nav_anchor.startsWith("#nav_")) {
            let now = $(nav_anchor);
            if (now.length > 0 && now.parent().hasClass("sub_nav")) sub_nav_click(now);
        }
    })();



    (() => { //头部导航
        let top_width = parseInt($("#top_nav_box").width()) - parseInt($("#top_nav").width());
        if (isNaN(top_width)) return;
        let pos = 0;
        const once = 25;
        (function(fn) {
            let xEvent = navigator.userAgent.indexOf('Firefox') >= 0 ? "DOMMouseScroll" : "mousewheel";
            if (document.attachEvent) {
                document.attachEvent('on' + xEvent, fn);
            } else {
                document.addEventListener(xEvent, fn, { passive: false });
            }
        })(event => {
            let tar = $(event.target);
            tar = tar.attr("id") === 'top_nav' ? tar : tar.parents("#top_nav");
            if (!(tar.length > 0)) return false;
            if (event.preventDefault) {
                event.preventDefault();
                event.stopPropagation();
            } else {
                event.cancelBubble = true;
                event.returnValue = false;
            }
            let scroll = event.detail ? (event.detail > 0 ? -once : once) : (event.wheelDelta < 0 ? -once : once);
            if ((pos < 0 || scroll <= 0) && (pos > top_width || scroll >= 0)) {
                pos += scroll;
                if (pos > 0) pos = 0;
                if (pos < top_width) pos = top_width;
                tar.css('left', pos);
            }

            return false;
        });
    })();

});
var change_nav__ = (index, clicked) => {
    if (nav_now_index === index) return;
    _hmt && _hmt.push(['_trackEvent', 'nav_change', window.location.pathname, ((event || {}).target || {}).innerText]);
    if (nav_now_index === undefined) {
        $(`.main-content:eq(${index})`).show().addClass("active");
    } else {
        let all = $(".main-content.active");
        let now = $(`.main-content:eq(${index})`);
        let old = nav_now_index < index ? -100 : 100;
        all.css('left', `${old}vw`);
        now.css('left', `${-old}vw`).show().css('left', 0).addClass("active");
        setTimeout(() => all.hide().removeClass("active"), 500);
    }

    nav_now_index = index;
    // let ms = $(".main-content");
    // ms.hide();
    // $(ms[nav_now_index = index]).show();

    let changeTab = (ele) => {
        ele.removeClass("active");
        $(ele[index]).addClass("active");
    }
    changeTab($("#top_nav").children());
    changeTab($("#head_nav").children());
}

function change_nav(index, clicked) {
    if (isNaN(index = parseInt(index)) || index < 0) return;
    change_nav__(index);
}

function nav_click(isHeadNav, index) {
    let tar;
    if (isNaN(index = parseInt(index))) {
        tar = (event || {}).target;
        if (!tar) return;
        index = $(isHeadNav ? tar.parentNode : tar).index();
    }
    change_nav(index, tar);
}
$(() => {
    $(".sub_nav").children().each(function() {
        let t = $(this);
        (t.data("events") || {})["click"] || (this.onclick = sub_nav_click);
    });
});

function sub_nav_click(tar) {
    tar = tar ? (tar.target || tar) : ((event || {}).target);
    if (!tar) return;
    tar = $(tar);
    tar.addClass("active");
    tar.siblings().removeClass("active");

    let content = $("#content_" + tar.attr('id').substring("nav_".length));
    content.siblings().css('display', 'none');
    content.css('display', '');
    console.log('sub_nav_click', tar);

    let js = tar.attr('data-content-init');
    if (js) eval(js), tar.attr('data-content-init', null);

    js = tar.attr('data-nav-change-event');
    js && eval(js);
}

setInterval(() => $("#main-content").height($("#main-content>.active").height()), 50);